var main = document.querySelector(".main");
console.log(main)
var btn_nav = document.querySelector(".btn_nav");
var phone_nav = document.querySelector(".phone_nav");
var click = true;
btn_nav.addEventListener("click",function(){
        if(click){
                phone_nav.style.display = "flex";
                click = false;
        }else{
                phone_nav.style.display = "none";
                click = true;
        }
        
})

var login_btn = document.querySelector(".login_btn");
var login = document.querySelector(".login");
var close = document.querySelector(".close");
login_btn.addEventListener("click",function(){
        login.style.display = "flex";
        main.style.opacity = "0.5"
})
close.addEventListener("click",function(){
        login.style.display = "none";
        main.style.opacity = "1"
})

/////////////////////////////////////////////////////////
var login_form = document.querySelector(".login_form");
var register = document.querySelector(".register");
var dlbtn = document.querySelector(".dlbtn"),
    zcbtn = document.querySelector(".zcbtn");

dlbtn.addEventListener("click",function(){
        register.style.display = "none";
        login_form.style.display = "block";
        dlbtn.style.color = "#fff";
        dlbtn.style.borderBottom = "2px solid #fff";
        zcbtn.style.borderBottom = "2px solid transparent";
        zcbtn.style.color = "#fcefdf";
  
        //transparent
  
})
zcbtn.addEventListener("click",function(){
        login_form.style.display = "none";
        register.style.display = "block";
        zcbtn.style.color = "#fff";
        zcbtn.style.borderBottom = "2px solid #fff";
        dlbtn.style.color = "#fcefdf";
        dlbtn.style.borderBottom = "2px solid transparent";
})